/**
 * @description 日历控件
 * @author 潘海春
 * @date 2007-09-20 
 */

//月份
var months = new Array("一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月");
//每月最后一天
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
//星期
var days = new Array("日","一", "二", "三", "四", "五", "六");
//目标控件
var theObject;

/**
 * 获取月份最后一天，大月，小月，闰月
 */
function getDays(month, year) {
    if (1 == month) {
		return (((0 == year % 4) && (0 != (year % 100))) || (0 == year % 400)) ? 29 : 28;
	}
    return daysInMonth[month];
}

/**
 * 当前日期
 */
function getToday() {
    var now = new Date();
    this.year = now.getFullYear();
    this.month = now.getMonth();
    this.day = now.getDate();
}

today = new getToday();

/**
 * 初始化一个日历
 */
function newCalendar() { 
    var parseYear = parseInt(document.all.year[document.all.year.selectedIndex].text);
    var newCal = new Date(parseYear, document.all.month.selectedIndex, 1);
    var day = -1;
    var startDay = newCal.getDay();
    var daily = 0;
    if ((today.year == newCal.getFullYear()) &&(today.month == newCal.getMonth())) {
		day = today.day;
	}
    var tableCal = document.all.calendar.tBodies.dayList;
    var intDaysInMonth = getDays(newCal.getMonth(), newCal.getFullYear());
    for (var intWeek = 0; intWeek < tableCal.rows.length;intWeek++) {
		for (var intDay = 0;intDay < tableCal.rows[intWeek].cells.length;intDay++) {
			var cell = tableCal.rows[intWeek].cells[intDay];
			if ((intDay == startDay) && (0 == daily)) {
				daily = 1;
			}
          	if(day == daily) {
          		cell.className = "today";
          	} else if(intDay == 6) {
          		cell.className = "sunday";
          	} else if (intDay == 0) {
          		cell.className = "satday";
          	} else {
          		cell.className = "normal";
          	}
          	if ((daily > 0) && (daily <= intDaysInMonth)) {
          		cell.innerText = daily;
          		daily ++;
          	} else {
              cell.innerText = "";
          	}
		}
	}
}

/**
 * 获取日期
 */
function getDate() {
	var day = event.srcElement.innerText;
	if ("" != day) {
		var year = document.all.year.value;
		var month = document.all.month.value;
		if(day < 10) {
			day = "0" + day;
		}
		if(month < 10) {
			month = "0" + month;
		}
		theObject.value = year + "-" + month + "-" + day;
		layer.style.display = "none";
	} else {
		theObject.value = "";
		layer.style.display = "none";
	}
}

/**
 * 隐藏控件
 */
function hideLayer() {
	layer.style.display = "none";
}

/**
 * 在指定位置上显示控件
 */
function showLayer(x, y) {
	layer.style.left = x + 1;
	layer.style.top = y + theObject.offsetHeight + 1;
	layer.style.display = "block";
}

/**
 * 获取元素在页面中的top高度
 */
function getTop(e) {
	var offset = e.offsetTop;
	if (e.offsetParent != null) {
		offset += getTop(e.offsetParent);
	}
	return offset;
}

/**
 * 获取元素在页面中的left宽度
 */
function getLeft(e) {
	var offset = e.offsetLeft;
	if (e.offsetParent != null) {
		offset += getLeft(e.offsetParent);
	}
	return offset;
}

/**
 * 触发，创建显示日历控件
 */
function showDateGrid(target) {
	theObject = target;
	var x = getLeft(target);
	var y = getTop(target);
	newCalendar();
	show();
	showLayer(x, y);
}

function show() {
	window.event.cancelBubble = true;
}

/**
 * 移动控件代码
 */
var dateGridId = null;
var dateGridX = 0;
var dateGridY = 0;
function startMoveDateGrid() {
	dateGridId = document.getElementById("layer").id;
	document.all(dateGridId).setCapture();
	dateGridX = event.x - document.all(dateGridId).style.pixelLeft;
	dateGridY = event.y - document.all(dateGridId).style.pixelTop;
}
function moveDateGrid() {
	if (dateGridId) {
		document.all(dateGridId).style.left = event.x - dateGridX;
		document.all(dateGridId).style.top = event.y - dateGridY;
	}
}
function endMoveDateGrid() {
	if (dateGridId) {
		document.all(dateGridId).releaseCapture();
		dateGridId = null;
	}
}

/**
 * 日历html代码
 */
function getLayer() {
	var html =	"<div id=\"layer\" onmousemove=\"moveDateGrid();\" onmouseup=\"endMoveDateGrid();\" onclick=\"show();\" style=\"z-index:999;position:absolute;width:184px;border:1px solid #0064AF;background-color:#B3D9FF;display:none;\">";
	html +=			"<table id=\"calendar\" style=\"background-color:#809DC7;text-align:center;border-collapse:collapse;font-size:12px;\">";
	html +=				"<tr>";
	html += 				"<td colspan=\"7\" style=\"background-color:#63B2ED;color:white;text-align:center;width:100%;line-height:20px;height:20px;cursor:move;border: 1px solid #DFDFFF;\" onmousedown=\"startMoveDateGrid();\">按住鼠标左键可拖动，右键关闭</td>";
	html += 			"</tr>";
	html +=				"<tr>";
	html += 				"<td style=\"height:21px;line-height:21px;border: 1px solid #DFDFFF;\" colspan=\"7\" align=\"center\">";
	html += 					"<select id=\"year\" onchange=\"newCalendar()\" name=\"select\" class=\"smallSel\">";
	for (var intLoop = today.year - 100; intLoop < (today.year + 100); intLoop++) {
		html += 					"<option value= " + intLoop + " " + (today.year == intLoop ?  "selected" : "") + ">" + intLoop + "年</option>";
	}
	html += 					"</select>";
	html += 					"<select id=\"month\" onchange=\"newCalendar()\" name=\"select\" class=\"smallSel\">";
	for (var intLoop = 0; intLoop < months.length; intLoop++) {
		html += 					"<option value= " + (intLoop + 1) + " " + (today.month == intLoop ? "selected" : "") + ">" + months[intLoop] + "</option>";
	}
	html += 					"</select>";
	html += 				"</td>";
	html += 			"</tr>";
	html += 			"<tr class=\"days\">";
	html += 				"<td style=\"height:18px;line-height:18px;border:1px solid #DFDFFF;\" class=\"satday\" align=\"center\" width=\"25px\">" + days[0] + "</td>";
	for (var intLoop = 1; intLoop < days.length - 1; intLoop ++) {
		html += 			"<td style=\"height:18px;line-height:18px;border:1px solid #DFDFFF;\" width=\"25px\" align=\"center\" bgcolor=\"#AABFDE\">" + days[intLoop] + "</td>";
	}
	html += 				"<td style=\"height:18px;line-height:18px;border:1px solid #DFDFFF;\" class=\"sunday\" width=\"25px\" align=\"center\">" + days[intLoop] + "</td>";
	html += 			"</tr>";
	html += 			"<tbody border=\"1px\" cellspacing=\"0\" cellpadding=\"0\" id=\"dayList\" align=\"center\" onclick=\"getDate()\">";
	for (var intWeeks = 0; intWeeks < 6; intWeeks ++) {
		html += 		"<tr style=\"cursor:hand;\">";
		for (var intDays = 0; intDays < days.length; intDays ++) {
			html += 		"<td style=\"height:15px;line-height:15px;border:1px solid #DFDFFF;\"></td>";
		}
		html += 		"</tr>";
	}
	html += 			"</tbody>";
	html += 		"</table>";
	html += 	"</div>";
	document.write(html);
	document.onclick = hideLayer;
	document.oncontextmenu = hideLayer;
}
document.write("<style type=\"text/css\">.smallSel{BACKGROUND-COLOR:#ffffff;width:90px;COLOR:#000080;FONT-SIZE:9pt;}.normal{BACKGROUND:#FFFFFF;}.today{font-weight:bold;BACKGROUND:#BEDDFD;}.satday{color:green;background-color:#C1D4F0}.sunday{color:red;background-color:#C1D4F0;}.days{font-weight:bold}.Arraw{color:#0000BB;cursor:hand;font-family:Webdings;font-size:9pt;}</style>");
getLayer();